<!--
 * @Description: 分包进场计划
 * @Author: wind-lc
 * @version: 1.0
 * @Date: 2022-03-18 14:50:14
 * @LastEditTime: 2022-08-11 15:27:07
 * @FilePath: \cscec-pms-admin\src\views\project\plannManagement\plannTableComponents\components\SubcontractingEntryPlan.vue
-->
<template>
    <a-card>
      <title-name title="分包进场计划" />
        <list-table
            :loading="loading"
            ref="table"
            size="default"
            :row-key="record=>record.id"
            :columns="columns"
            :request="loadData1"
            :alert="true"
            :isFixedRight="false"
            show-pagination="auto"
        >
            <span
                slot="serial"
                slot-scope="text, record, index"
            >{{ index + 1 }}</span>
        </list-table>
        <title-name title="分供进场计划" />
        <list-table
            :loading="loading"
            ref="table"
            size="default"
            :row-key="record=>record.id"
            :columns="columns"
            :request="loadData2"
            :alert="true"
            :isFixedRight="false"
            show-pagination="auto"
        >
            <span
                slot="serial"
                slot-scope="text, record, index"
            >{{ index + 1 }}</span>
        </list-table>
    </a-card>
  </template>
  <script>
  import { scheme } from '@/api/project/plannManagement/plannTableSummary'
  import { SubPlanEntryQueryDetail } from '@/api/project/plannManagement/interpenetrationPlan.js' // api
  export default {
    name: 'SubcontractingEntryPlanNew' + Date.now(),
    components: {},
    data() {
      return {
        // 表头
        columns: [
          {
            title: '序号',
            width: 80,
            align: 'center',
            customRender: (text, record, index) => {
              return index + 1
            }
          },
          {
            title: '分包名称',
            dataIndex: 'businessMatters',
            align: 'center',
          },
          {
            title: '计划招标时间',
            dataIndex: 'planTenderTime',
            align: 'center',
          },
          {
            title: '计划合同签订',
            dataIndex: 'planContractTime',
            align: 'center',
          },
          {
            title: '计划正式进场',
            dataIndex: 'planEntryTime',
            align: 'center',
            // scopedSlots: { customRender: 'approachTime' }
          }
        ],
        total1: 0,
        total2: 0,
        // 查询参数
        queryParam: {
            param: {
                "latestData": true,
                "schemeDetailId": this.$route.query.id,
                "version": this.$route.query.version || 0,
            }
        },
        loadData1: parameter => {
            let params = JSON.parse(JSON.stringify(this.queryParam));
            params.param.subType='分包招采'
            const requestParameters = Object.assign({}, parameter, params)
            return SubPlanEntryQueryDetail(requestParameters)
              .then(res => {
                this.total1 = res.totalSize;
                return res
              })
        },
        loadData2: parameter => {
          let params = JSON.parse(JSON.stringify(this.queryParam));
          params.param.subType='分供招采'
          const requestParameters = Object.assign({}, parameter, params)
          return SubPlanEntryQueryDetail(requestParameters)
            .then(res => {
              this.total2 = res.totalSize;
              return res
            })
        },
        // 表数据
        data: [],
        // 必填项
        required: ['subcontractName', 'tenderTime', 'contractTime', 'approachTime'],
        // 选中项
        selectedRowKeys: [],
        // 加载
        loading: false
      }
    },
    computed: {
      // 地址携带信息
      info() {
        return this.$route.query
      }
    },
    mounted() {
    //   this.getData()
    },
    methods: {
      /**
       * @description: 获取数据
       * @param {void}
       * @return {void}
       */
      async getData() {
        this.data = []
        const { id, version } = this.info
        this.loading = true
        const { code, data } = await scheme.querySchemeSubcontractApproachPlanDetail({
          latestData: version ? false : true,
          schemeDetailId: id,
          version
        })
        if (code === 200 && data.length > 0) {
          // 已有数据
          this.data = data.map((el, index) => {
            const item = this.$clone(el)
            if (el.tenderStartTime && el.contractStartTime) {
              item.tenderTime = [el.tenderStartTime, el.tenderEndTime]
              item.contractTime = [el.contractStartTime, el.contractEndTime]
            }
            // 目前列表未返回id，会导致索引报错以及删除不成功，此处加上id
            if(!item.id){
              item.id = 'temp' + index
            }
            return item
          })
        } else {
          // 没有数据
          this.handleAdd()
        }
        this.loading = false
      },
      /**
       * @description: 选中项改变
       * @param {string} selectedRowKeys 选中项id
       * @return {void}
       */
      onSelectChange(selectedRowKeys) {
        this.selectedRowKeys = selectedRowKeys
      },
      /**
       * @description: 新增行
       * @param {void}
       * @return {void}
       */
      handleAdd() {
        const data = {}
        this.columns.forEach((el) => {
          if (el.dataIndex) {
            data[el.dataIndex] = null
          } else {
            data.id = 'temp' + Date.now()
          }
        })
        this.data.push(data)
      },
      /**
       * @description: 删除行
       * @param {void}
       * @return {void}
       */
      handleDelete() {
        this.data = this.data.filter((el) => !this.selectedRowKeys.includes(el.id))
        this.selectedRowKeys = []
      },
      /**
       * @description: 表格校验
       * @param {void}
       * @return {boolean} 是否通过校验
       */
      verify() {
        return !this.data.some((el) => {
          for (let item in this.required) {
            if ((el[this.required[item]] ?? '') === '') {
              return true
            }
          }
        })
      },
      /**
       * @description: 保存草稿
       * @param {object} baseInfo 基本信息
       * @return {void}
       */
      SubcontractingEntryPlanNewSaveDrafts(baseInfo) {
        this.handleSubmit(0,baseInfo)
      },
      /**
       * @description: 提交
       * @param {object} baseInfo 基本信息
       * @return {void}
       */
      SubcontractingEntryPlanNewSubmit(baseInfo) {
        if (this.verify()) {
          const vm = this
          this.$confirm({
            title: '温馨提示',
            content: '请确认是否提交？',
            onOk() {
              vm.$emit('update:spinning', true)
              vm.handleSubmit(1, baseInfo)
            },
            onCancel: () => { this.$emit('update:spinning', false)}
          })
        } else {
          this.$confirm({
            title: '温馨提示',
            content: '请将数据填写完整'
          })
        }
      },
      /**
       * @description: 数据提交
       * @param {number} status 状态码
       * @return {void}
       */
      handleSubmit(status,baseInfo) {
        const { id: schemeDetailId, pageType } = this.info
        baseInfo.schemeDetailId = schemeDetailId
        baseInfo.status = status
        this.$emit('updateBasicDetail', baseInfo) 
        status * 1===1 && this.$emit('closePage');
        // scheme
        //   .batchUpdateSchemeSubcontractApproachPlan({
        //     changed: pageType === 'change',
        //     list: this.data.map(({ subcontractName, tenderTime, contractTime, approachTime }) => {
        //       return {
        //         subcontractName,
        //         tenderStartTime: this.moment(tenderTime[0]).format('YYYY-MM-DD'),
        //         tenderEndTime: this.moment(tenderTime[1]).format('YYYY-MM-DD'),
        //         contractStartTime: this.moment(contractTime[0]).format('YYYY-MM-DD'),
        //         contractEndTime: this.moment(contractTime[1]).format('YYYY-MM-DD'),
        //         approachTime: this.moment(approachTime).format('YYYY-MM-DD')
        //       }
        //     }),
        //     schemeDetailId,
        //     status
        //   })
        //   .then(({ code }) => {
        //     if (code === 200) {
        //       this.$message.success('操作成功')
        //       baseInfo.schemeDetailId = schemeDetailId
        //       baseInfo.status = status
        //       this.$emit('updateBasicDetail', baseInfo) 
        //       this.getData()
        //       if (status === 1) {
        //         this.$close()
        //       }
        //     }
        //   })
      }
    }
  }
  </script>
  <style lang="less" scoped>
  @deep: ~'>>>';
  .add {
    margin-right: 20px;
    margin-bottom: 20px;
  }
  @{deep}.input {
    .ant-input,
    .ant-input-number,
    .ant-select-selection {
      border-color: #e4ac0b;
      background-color: #fff9e8;
    }
  }
  </style>
  
  